<div class="row">
  <div class="col-sm-6">
    <%= form_with url: stripe_charges_path, local: true, id: "payment-form" do |form| %>
      <div class="form-group">
        <%= form.label :amount, "Amount in cents" %>
        <%= form.text_field :amount, value: 1500, class: "form-control" %>
      </div>

      <div class="form-group">
        <label for="name-on-card">
          Name on Card
        </label>

        <input type="text" id="name_on_card" class="form-control" value="Test User" />
      </div>

      <div class="form-group">
        <label for="card-element">
          Credit or debit card
        </label>
        <div id="card-element" class="form-control">
          <!-- A Stripe Element will be inserted here. -->
        </div>

        <!-- Used to display Element errors. -->
        <div id="card-errors" role="alert"></div>
      </div>

      <%= form.submit "Checkout", class: "btn btn-primary" %>
    <% end %>
  </div>

  <div class="col-sm-6">
    <h6>Test Cards</h6>
    <div>
      <code class="mr-3">4242 4242 4242 4242</code>
      No Authentication
    </div>

    <div>
      <code class="mr-3">4000 0027 6000 3184</code>
      Requires Authentication
    </div>

    <%= link_to "All Test Cards", "https://stripe.com/docs/testing", target: :_blank, class: "btn btn-outline-dark btn-sm mt-3" %>
  </div>
</div>
